<template>
  <div class="component-root">
    <el-card>
      <p slot="header">
        <span><b>配送说明</b></span>
        <el-button type="primary" class="base-el-float-right" @click="handleUpdate('配送说明')">更新</el-button>
      </p>

      <el-input v-model="deliveryExplain" type="textarea" :autosize="{ minRows: 2, maxRows: 40}" />
    </el-card>
  </div>
</template>
<script>

import { queryByCondition, updateById } from '@/api/commoncrud'
export default {
  name: 'UserAgreementContent',
  data() {
    return {
      deliveryExplainId: '',
      deliveryExplain: ''
    }
  },
  async mounted() {
    await this.fetchData()
  },
  methods: {
    async fetchData() {
      const res = await queryByCondition('globalconfig', 0, 1, { name: 'delivery_explain' })
      const data = res.data.documentList[0]
      this.deliveryExplainId = data._id
      this.deliveryExplain = data.data
    },
    async handleUpdate(title) {
      this.$alert(`确认更新${title}?`, '消息提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        showCancelButton: true,
        callback: async action => {
          if (action === 'confirm') {
            await updateById('globalconfig', this.deliveryExplainId, { data: this.deliveryExplain })
            this.$message.success('更新成功!')
            await this.fetchData()
          }
        }
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.component-root{
  margin: 20px;
}
.margin-right{
  margin-right: 20px;
}
</style>
